<template>
  <div id="home">
   欢迎使用后台管理模版
  </div>
</template>

<script>
  import {
    Component,
    Prop,
    Vue
  } from 'vue-property-decorator'

  @Component
  export default class Home extends Vue {
    created() {} // 生命周期 - 创建完成（可以访问当前this实例）

    mounted() {} // 生命周期 - 挂载完成（可以访问DOM元素）
    beforeCreate() {} // 生命周期 - 创建之前
    beforeMount() {} // 生命周期 - 挂载之前
    beforeUpdate() {} // 生命周期 - 更新之前
    updated() {} // 生命周期 - 更新之后
    beforeDestroy() {} // 生命周期 - 销毁之前
    destroyed() {} // 生命周期 - 销毁完成
    activated() {} // 如果页面有keep-alive缓存功能，这个函数会触发
  }
</script>
<style lang="scss" scoped>
  //@import url(); 引入公共css类
  #home {
    padding: 0px 10px;
  }

  .item-to {
    background-color: #fef0f0;
    color: #f56c6c;
  }

  .item-read {
    background-color: #f4f4f5;
    color: #909399;
  }
</style>
